<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>局部组件</title>
	
	</head>
	<body>
		<div id="app">
			<hello1></hello1>
		</div>
		
		<template id="helloTem">
			<div>
				<h3>{{msg}}</h3>
			</div>
		</template>
		
	
		<script src="../js/vue.js"></script>
		
		<script>
			//1.定义组件对象
			const hello1 ={
				data(){
					return{
						msg:'hello1局部组件'
					}
				},
				template:'#helloTem'
			}
		
		/*局部组件的写法 */
		const app1 =new Vue({
			el:"#app",
			//vue对象中的组件
			components:{
				//K:V  组件名称：组件对象
				// hello1 : hello1
				hello1
			}
		})
		
		</script>
	</body>
</html>
